<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<!-- source http://www.scnoob.com More templates http://www.scnoob.com/moban -->
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 <title>商品信息</title>

 <link rel="stylesheet" type="text/css" th:href="@{/assets/css/bootstrap.min.css}">

 <link rel="stylesheet" type="text/css" th:href="@{/assets/fonts/line-icons.css}">

 <link rel="stylesheet" th:href="@{/assets/plugins/morris/morris.css}">

 <link rel="stylesheet" type="text/css" th:href="@{/assets/css/icons.css}">

 <link rel="stylesheet" type="text/css" th:href="@{/assets/css/main.css}">

 <link rel="stylesheet" type="text/css" th:href="@{/assets/css/responsive.css}">

 <link rel="stylesheet" th:href="@{/css/common.css}">

 <script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#style=-1&amp;uuid=&amp;pophcol=3&amp;lang=zh"></script>
 <script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bshareC0.js"></script>
</head>
<body>
<div class="app header-default side-nav-dark">
 <div class="layout">
     <div class="header navbar">
         <div class="header-container">
             <ul class="nav-left">
                 <li>
                     <a href="javascript:history.back(-1);">
                         <i class="lni-chevron-left" style="border: transparent;"></i>
                     </a>
                 </li>
             </ul>
             <ul class="nav-right" style="margin-right: 20px;">
                 <li class="user-profile dropdown dropdown-animated scale-left">
                     <a th:href="@{/front/user/userPath}">
                         我的
                     </a>
                 </li>
             </ul>
         </div>
     </div>
     <div class="footer navbar" style="border-top: 1px solid #f6f6f6;">
         <div class="footer-container">
             <!--<ul class="nav-left" th:if="${session.userEntity} != null">
                 <li class="user-profile dropdown dropdown-animated scale-left">
                     <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                         <span>分享</span>
                     </a>
                     <ul class="dropdown-menu dropdown-md" id="dropdown-phone">
                         <div class="bshare-custom">
                             <input type="text" th:if="${referId} == null" name="referId" th:value="${session.userEntity.id}" hidden>
                             <input type="text" th:if="${referId} != null" name="referId" th:value="${referId}" hidden>
                             <p><a title="分享到微信" class="bshare-weixin" href="javascript:void(0);">&nbsp;&nbsp;微信</a></p>
                             <p><a title="分享到朋友网" class="bshare-qqxiaoyou" href="javascript:void(0);">&nbsp;&nbsp;朋友圈</a></p>
                             <p><a title="分享到QQ好友" class="bshare-qqim" href="javascript:void(0);">&nbsp;&nbsp;QQ好友</a></p>
                             <p><a title="分享到QQ空间" class="bshare-qzone">&nbsp;&nbsp;QQ空间</a></p>
                             <p><a title="分享到新浪微博" class="bshare-sinaminiblog">&nbsp;&nbsp;新浪微博</a></p>
                         </div>
                     </ul>
                 </li>
             </ul>
             <ul class="nav-right">
                 <li class="user-profile dropdown dropdown-animated scale-left">
                     <a th:href="@{/front/user/userPath(referId=${referId})}">
                         <button type="button" class="btn btn-light btn-rounded">
                             <span>我的</span>
                         </button>
                     </a>
                 </li>
             </ul>-->
             <div class="pt-3 w-50 ml-auto mr-auto">
                 <button type="button" onclick="submit();" class="btn btn-danger w-100">立即购买</button>
             </div>
         </div>
     </div>
     <div class="page-container" style="padding: 64px 0 65px 0!important;">
         <div class="article-clean">
             <div class="container">
                 <div class="row" >
                     <div class="col-lg-10 col-xl-8 offset-lg-1 offset-xl-2 p-0">
                         <div class="intro">
                             <div class="card card-body">
                                 <div class="row m-t-35 m-b-30">
                                     <div class="col-md-8 offset-md-2">
                                         <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel" th:if="${images != null}">
                                             <ol class="carousel-indicators">
                                                 <li data-target="#carouselExampleIndicators" th:each="img:${images}" th:if="${img.index == 0}" th:data-slide-to="${img.index}" class="active"></li>
                                                 <li data-target="#carouselExampleIndicators" th:each="img:${images}" th:if="${img.index != 0}" th:data-slide-to="${img.index}" class=""></li>
                                             </ol>
                                             <div class="carousel-inner">
                                                 <div class="carousel-item active" th:if="${img.index == 0}" th:each="img:${images}">
                                                     <img class="d-block w-100" th:src="${img.imgUrl}" alt="">
                                                 </div>
                                                 <div class="carousel-item" th:if="${img.index != 0}" th:each="img:${images}">
                                                     <img class="d-block w-100" th:src="${img.imgUrl}" alt="">
                                                 </div>
                                             </div>
                                             <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
                                                 <span class="mdi mdi-chevron-left" aria-hidden="true"></span>
                                             </a>
                                             <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
                                                 <span class="mdi mdi-chevron-right" aria-hidden="true"></span>
                                             </a>
                                         </div>
                                         <div class="col-md-8 col-lg-9 text-center p-0"  th:if="${images == null}">
                                             <img th:src="${product.image}" alt="productInfo" class="img-circle img-fluid">
                                         </div>
                                     </div>
                                 </div>
                                 <div class="row align-items-center">
                                     <div class="col-md-4 col-lg-3 pt-3">
                                         <form id="form" action="/front/orderPhone/orderGenerate" method="post">
                                             <input type="text" name="productId" th:value="${product.id}" hidden>
                                             <h3 class="text-left" name="productName" th:text="${product.name}" ></h3>
                                             <p class="m-0">
                                                 <span>价格：</span>
                                                 <span th:text="${product.price}" name="price" class="t-color-danger" style="font-size: 1.5rem;"></span>
                                                 <span class="pl-2 t-color-danger">RMB</span>
                                             </p>
                                             <input type="text" name="totalNum" value="1" hidden>
                                             <!--<div class="buy" style="height: 42px;line-height: 42px;">
                                                 <p class="d-inline-block">
                                                    <span>购买数量：</span>
                                                 </p>
                                                 <a href="javascript:void(0);">
                                                     <div id="down" class="d-inline-block" style="vertical-align: middle;font-size: 1.5rem;margin: 0 12px 0 0;padding: 0">
                                                         <i class="mdi mdi-minus-circle-outline"></i>
                                                     </div>
                                                 </a>
                                                 <input id="buyCount" name="totalNum" class="text-center" style="vertical-align: middle;width: 25px;height: 25px;" type="text" value="1">
                                                 <a href="javascript:void(0);" >
                                                     <div id="up" class="d-inline-block" style="vertical-align: middle;font-size: 1.5rem;margin:0 0 0 12px;padding: 0;">
                                                         <i class="mdi mdi-plus-circle-outline"></i>
                                                     </div>
                                                 </a>
                                             </div>-->
                                         </form>
                                     </div>
                                 </div>
                             </div>
                             <div class="text rich-text" th:utext="${product.introduce}">
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
     </div>

 </div>
</div>
<div id="preloader">
 <div class="loader" id="loader-1"></div>
</div>


<script th:src="@{/assets/js/jquery-min.js}"></script>
<script th:src="@{/assets/js/popper.min.js}"></script>
<script th:src="@{/assets/js/bootstrap.min.js}"></script>
<script th:src="@{/assets/js/jquery.app.js}"></script>
<script th:src="@{/assets/js/main.js}"></script>

<script th:src="@{/assets/plugins/morris/morris.min.js}"></script>
<script th:src="@{/assets/plugins/raphael/raphael-min.js}"></script>
<!--<script th:src="@{/assets/js/dashborad1.js}"></script>-->
<script th:inline="javascript">
    $(".bshare-custom a").click(function () {
        var url = window.location.href;
        /*if (url.search("referId=") == -1){
            url = url+"&referId="+$('input[name="referId"]').val();
        }*/
        bShare.addEntry({
            title: $('input[name="productName"]').val(),
            url: url,
            summary: "分享的文本摘要，默认为页面Meta标签中description的内容或者用户高亮的内容",
            pic: "指定分享的图片的链接，目前支持新浪微博，QQ空间，搜狐微博，网易微博，人人网， 嘀咕，腾讯微博和做啥。"
        });
    });
</script>
<script type="text/javascript">
    $(function () {
        $('#up').click(function () {
            var input = $('#buyCount').val();
            if (input == 1){
                $('#down').removeClass("disabled");
            }
            input++;
            $('#buyCount').val(input);
        });
        $('#down').click(function () {
            var input = $('#buyCount').val();
            if(input > 1){
                input--;
                $('#buyCount').val(input);
            }else {
                $('#down').addClass("disabled");
            }
        });
        $('#buyCount').blur(function () {
            var input = $('#buyCount').val();
            if(input < 1){
                input--;
                $('#buyCount').val(1);
            }
        });

        /*//bShare分享
        var iBShare = {
            //初始化
            init: function() {
                var $shareBox = $(".bshare-custom");
                //加载分享工具
                var tools = '<a title="分享到QQ空间" class="bshare-qzone"></a>';
                tools += '<a title="分享到新浪微博" class="bshare-sinaminiblog"></a>';
                tools += '<a title="分享到人人网" class="bshare-renren"></a>';
                tools += '<a title="更多平台" class="bshare-more bshare-more-icon more-style-addthis"></a>';
                $shareBox.append(tools);
                //绑定分享事件
                $shareBox.children("a").click(function() {
                    var parents = $(this).parent();
                    bShare.addEntry({
                        title: parents.attr("title"),
                        url: parents.attr("url"),
                        summary: parents.attr("summary"),
                        pic: parents.attr("pic")
                    });
                });
            }
        }*/
    });
    function submit() {
        $("#form").submit();
    }
</script>
</body>

</html>